<div class="b-folders g-ui-user-select-none thm-folders" data-bind="css: {'focused': folderListFocused,
	'single-root-inbox': foldersListWithSingleInboxRootFolder}">
    <div class="b-toolbar btn-toolbar">
        <a class="btn buttonCompose pull-left" data-tooltip-join="top"
			data-bind="visible: allowComposer, click: composeClick, tooltip: 'FOLDER_LIST/BUTTON_COMPOSE', css: {'btn-warning': composeInEdit}">
            <i class="icon-paper-plane"></i>
        </a>
        <a class="btn buttonContacts pull-left" data-tooltip-join="top" data-bind="visible: allowContacts, click: contactsClick, tooltip: 'FOLDER_LIST/BUTTON_CONTACTS'">
            <i class="icon-address-book"></i>
        </a>
    </div>
	<div class="b-content opacity-on-panel-disabled" data-bind="visible: allowFolders, nano: true, scrollerShadows: true">
		<div class="content g-scrollbox" data-scroller-shadows-content>
			<div class="content-wrapper">
				<div class="b-folders-system" data-bind="template: { name: 'MailFolderListSystemItem', foreach: folderListSystem }"></div>
				<hr class="b-list-delimiter" />
				<div class="b-folders-user" data-bind="template: { name: 'MailFolderListItem', foreach: folderList }"></div>
			</div>
		</div>
	</div>
    <div class="b-content show-on-panel-disabled" data-bind="click: function () { leftPanelDisabled(false); }"></div>
	<div class="b-footer" data-bind="visible: allowFolders">
        <nobr>
	        <div class="btn-toolbar">
                <div class="btn-group hide-on-panel-disabled">
                    <a class="btn first" data-bind="click: createFolder">
                        <i data-bind="css: {'icon-folder-add': !foldersChanging(), 'icon-spinner animated': foldersChanging()}"></i>
                    </a>
                    <a class="btn last" data-bind="click: configureFolders">
                        <i class="icon-cog"></i>
                    </a>
                </div>
                <div class="btn-group">
                    <a class="btn single buttonResize" data-bind="click: function () { leftPanelDisabled(!leftPanelDisabled()); }">
						<i data-bind="css: {'icon-resize-out': leftPanelDisabled(), 'icon-resize-in': !leftPanelDisabled()}"></i>
                    </a>
                </div>
            </div>
        </nobr>
	</div>
</div>